// 服务器返回的数据类型，通过泛型指定核心数据的类型
interface SeverResponse<T> {
  code: number //响应状态码
  data: T  //核心数据
  msg: string //响应消息
}
Page({
  data: {
    isRefreshing: false,//是否开启下拉刷新
    jokeList: [] as string[] //存储笑话列表的数据
  },
  onLoad() {
    this.getData() //页面加载时获取笑话数据
      .then((res) => {
        this.setData({
          jokeList: res
        })
      })
  },
  // 获取笑话数据的方法
  getData() {
    // 返回 Promise 对象 ：resolve成功 、reject失败
    return new Promise<string[]>((resolve, reject) => {
      wx.showLoading({ title: '笑话加载中...' }) //数据加载时提示
      wx.request<SeverResponse<string[]>>({
        url: 'https://api-vue-base.itheima.net/api/joke/list',//请求地址
        method: 'GET', //请求方法
        //接口必写请求参数 num
        data: { num: 10 }, //请求参数
        success: (res) => {
          console.log(res) //打印响应结果，测试用
          // 更新页面+数据
          // this.setData({
          //   jokeList: res.data.data
          // })
          // 数据请求成功  调用 resolve 修改 Promise 对象状态为成功 
          resolve(res.data.data)
        },
        fail: () => {
          // 数据请求失败  调用 reject 修改 Promise 对象状态为失败
          reject()
        },
        complete: () => {
          wx.hideLoading() //隐藏加载提示 （请求完成 不管成功失败）
        },
      })
    })
  },
  // 下拉刷新
  async onRefresherrefresh() {
    // 开启下拉刷新动画
    this.setData({
      isRefreshing: true
    })
    // await 等待数据请求
    this.setData({
      jokeList: await this.getData()
    })
    // 数据请求成功后,关闭下拉刷新动画
    this.setData({
      isRefreshing: false
    })
  },
  // 滚动触底,获取更多笑话
  async getMoreData() {
    // wx.showToast({title:'滚动触底'})
    // 获取Promise成功时的返回值
    const res = await this.getData()
    // 更新数据 + 界面
    this.setData({
      // 滚动触底，追加新的笑话列表
      jokeList: [...this.data.jokeList, ...res]
    })
  },

})